<template>
    <ul>
        <li v-for="(item, i) in list" :key="i" @click="detatilJump(item.kbiId)">
            <p class="word-clamp-2">
                <i v-if="item.kbiType === 'DOCUMENT'" class="iconfont icon-biaodanku" style="color:#075ebb;margin-right:5px"></i> <!--文档-->
                <i v-if="item.kbiType === 'VEDIO'" class="iconfont icon-shipin" style="color:#075ebb;margin-right:5px"></i> <!--文档-->
                <i v-if="item.kbiType === 'AUDIO'" class="iconfont icon-yinpin" style="color:#075ebb;margin-right:5px"></i> <!--文档-->
                <i v-else-if="item.kbiType === 'ARTICLE'" class="iconfont icon-renwuguanli1" style="color:#075ebb;margin-right:5px"></i><!--文章-->
                <span>{{item.kbiTitle}}</span>
            </p>
            <div class="date-box">
                <div style="display:flex">
                    <span class="margin-right20 vc"><i class="iconfont icon-liulan"></i>{{item.kbiAccessCount || 0}}</span>
                    <span><i class="iconfont icon-dianzan"></i>{{item.valuationCount || 0}}</span>
                </div>
                <div>{{item.kbiPublishDatetime}}</div>
            </div>
        </li>
    </ul>
</template>
<script>
import {cwnEncrypt} from '@/utils/tools';
export default {
    name: 'knowledgeListItem',
    props: {
        list: {
            type: Array,
            default() {
                return [];
            }
        }
    },
    data() {
        return {};
    },
    methods: {
        ...{ cwnEncrypt },
        /**
         * 进入详情
         * */
        detatilJump(id) {
            this.$router.push({path: `/knowledgeDetail/${this.cwnEncrypt(id)}`});
        }
    }
};
</script>
<style scoped lang="less">
    ul {
        padding: 15px 0;
        li{
            padding: 15px 20px;
            background: #fff;
            margin-bottom: 8px;
            .date-box{
                display: flex;
                justify-content: space-between;
                align-items: flex-end;
                margin-top: 16px;
                font-size: 12px;
                color: #999;
                i{
                    margin-right: 5px;
                }
            }
        }
    }
</style>
